feat: add support for Angular 21 #33004
Open
+7,265
−106
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
AtofStryker
force-pushed
the
feat/support_angular_21
branch
from
ea970e7 to
0f3772b
Compare
cypress
|
||||||||||||||||||||||||||||||||||||||||
| Project |
cypress
|
| Branch Review |
feat/support_angular_21
|
| Run status |
|
| Run duration | 19m 15s |
| Commit |
|
| Committer | Bill Glesias |
| View all properties for this run ↗︎ | |
| Test results | |
|---|---|
Failures
|
0
|
Flaky
|
2
|
Pending
|
27
|
Skipped
|
0
|
Passing
|
798
|
| View all changes introduced in this branch ↗︎ | |
UI Coverage
62.34%
|
|
|---|---|
|
Untested elements
|
27
|
|
Tested elements
|
48
|
Accessibility
99.03%
|
|
|---|---|
|
Failed rules
|
0 critical
3 serious
1 moderate
0 minor
|
|
Failed elements
|
19
|
AtofStryker
force-pushed
the
feat/support_angular_21
branch
from
0f3772b to
d8271ce
Compare
AtofStryker
force-pushed
the
feat/support_angular_21
branch
from
d8271ce to
050dc8a
Compare
AtofStryker
force-pushed
the
feat/support_angular_21
branch
from
050dc8a to
da19b3f
Compare
AtofStryker
force-pushed
the
feat/support_angular_21
branch
from
da19b3f to
0d85a78
Compare
AtofStryker
force-pushed
the
feat/support_angular_21
branch
from
38907b6 to
8d18b26
Compare
| constructor (private counterService: CounterService) { | ||
| this.count$ = this.counterService.count$ | ||
| } | ||
| count = model<number>(0) |
There was a problem hiding this comment.
Bug: Incorrect use of model signal for internal state
The model() function is used for count, but model() is specifically for two-way binding with parent components (input/output), not for internal component state. For internal state management, signal() should be used instead. This will cause the component to not work correctly as model() expects to be bound to a parent component property.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Additional details
Adds support for Angular 21 within Cypress Component testing. Right now the Angular 21 projects needs
zone.jsas adevDependencyascypress/angularcurrently only supports zone.js. I will have a follow up PR that adds a zoneless mount handler and defaults the scaffolding tocypress/angular-zonelessfor Angular 21 applicationsAs Angular 21's change detection is a bit different from the legacy implementations, I refactored some of the angular fixtures to use signals instead of observables as signals are fully supported as of angular 18+
Steps to test
use the prepublished binaries to make sure scaffolding works on a new angular 21 project
How has the user experience changed?
Users will now be able to use Angular 21 without Cypress scaffolding warnings. NOTE: this currently still requires the zone.js devDependency until the zoneless mount handler is merged down. The intent is for both of these two be shipped at the same time but the work is considered separate.
PR Tasks
cypress-documentation? chore: add angular 21 documentation cypress-documentation#6326type definitions?Note
Adds Angular 21 component testing support, updates scaffolding/deps and tests, introduces an Angular 21 system-test fixture, and updates CI filters.
system-tests/projects/angular-21fixture (withangular.json,cypress.config.ts,package.json,tsconfig.json).21incomponent_testing_spec.tsmatrix and WDS e2e (angular.cy.ts).angular-21.fetch; removeHttpClient/service where unnecessary.componentRef.setInputand dropHttpClientModuleimports; removecounter.service.angularHandlertests for Angular 20/21 config shapes and tsconfig generation flag.@angular/*and DevKit) and detection tests.angular-20andangular-21.feat/support_angular_21and artifact persistence conditions.Written by Cursor Bugbot for commit 5d5b79a. This will update automatically on new commits. Configure here.